.ob-calendar-overlay {
    position: fixed;
    background: rgba(0, 0, 0, 0.25);
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    -webkit-backface-visibility: hidden;
    -webkit-animation: ngdialog-fadein 0.5s;
    animation: ngdialog-fadein 0.5s;
    z-index: 10000000000;
    display: none;
}
.ob-calendar-area {
    position: fixed;
    top: 70px;
    right: 0px;
    width: 420px;
    height: 484px;
    background: #FFFFFF;
    z-index: 10000000001;
    border: 1px solid #E8E8E8;
    display: none;
}
.ob-calendar-header {
    position:absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    background: #FFFEF4;
    height: 41px;
    text-align: center;
    font-size: 15px;
    color: #666666;
}
.ob-calendar-week-area {
    position:absolute;
    top: 41px;
    left: 0px;
    right: 0px;
    background: #FAFAFA;
    height: 39px;
}
.ob-calendar-week-title {
    position:absolute;
    top: 9px;
    width: 60px;
    font-size: 15px;
    color: #666666;
    text-align: center;
}
.ob-calendar-days-area {
    position:absolute;
    top: 80px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}
.ob-calendar-day {
    position: absolute;
    width: 56px;
    height: 65px;
    margin-top: 1px;
    margin-left: 1px;
    background: #ffffff;
    padding-top: 3px;
    text-align: center;
}
.ob-calendar-day-solar {
    width: 50px;
    margin-left: -9.5px;
    font-size: 24px;
    color: #555555;
    padding: 0px !important;
}
.ob-calendar-day-weekend {
    width: 50px;
    margin-left: -9.5px;
    font-size: 24px;
    color: #FB493E;
}
.ob-calendar-day-lunar {
    width: 50px;
    margin-left: -9.5px;
    font-size: 13px;
    color: #999999;
}
.ob-calendar-day-festival {
    width: 50px;
    margin-left: -9.5px;
    font-size: 13px;
    color: #FA5C54;
}
.ob-calendar-day-term {
    width: 50px;
    margin-left: -9.5px;
    font-size: 13px;
    color: #12BA01;
}
.ob-calendar-day.selected {
    background: #FEB900;
    border-radius: 4px;
}
.ob-calendar-day.selected div {
    color: #ffffff;
}
.ob-calendar-day.selected.today {
    background: #FEB900;
}
.ob-calendar-day.selected.today div {
    margin-left: -11px;
    width: 51px;
}
.ob-calendar-day.today {
    background: #FFFFFF;
    border: 2px solid #FEB900;
    border-radius: 4px;
}
.ob-calendar-day.today div {
    margin-left: -11px;
    width: 51px;
}
.ob-calendar-weekend-color {
    color: rgba(255,55,66,0.75);
}
.ob-clp-1 {
    left: 0px;
}
.ob-clp-2 {
    left: 60px;
}
.ob-clp-3 {
    left: 120px;
}
.ob-clp-4 {
    left: 180px;
}
.ob-clp-5 {
    left: 240px;
}
.ob-clp-6 {
    left: 300px;
}
.ob-clp-7 {
    left: 360px;
}
.ob-cvp-1 {
    top: 0px;
}
.ob-cvp-2 {
    top: 67px;
}
.ob-cvp-3 {
    top: 134px;
}
.ob-cvp-4 {
    top: 201px;
}
.ob-cvp-5 {
    top: 268px;
}
.ob-cvp-6 {
    top: 335px;
}
#ob-calendar-years {
    z-index: 10000000002;
    position: absolute;
    top: 41px;
    left: 0px;
    width: 110px;
    height: 210px;
    text-align: center;
    background: #ffffff;
    border: #E8E8E8 1px solid;
    cursor: pointer;
    overflow-x: auto;
    display: none;
}
#ob-calendar-years > .active {
    background: #FEB900;
    color: #ffffff;
}
#ob-calendar-years > div {
    padding: 3px;
}

#ob-calendar-months {
    z-index: 10000000002;
    position: absolute;
    top: 41px;
    right: 0px;
    width: 110px;
    text-align: center;
    background: #ffffff;
    border: #E8E8E8 1px solid;
    cursor: pointer;
    display: none;
}
#ob-calendar-months > .active {
    background: #FEB900;
    color: #ffffff;
}
#ob-calendar-months > div {
    padding-top: 3px;
    padding-bottom: 3px;
}


.ob-reserve-time-area {
    position: absolute;
    top:290px;
    left: 50%;
    margin-left: -310px;
    width: 280px;
    height: 240px;
    background: #ffffff;
    z-index: 10000;
    border: #cccccc 1px solid;
    box-shadow: 0px 2px 2px 2px #dddddd !important;
    color: #666666;
    display: none;
}
.ob-reserve-time-hour-area {
    position: absolute;
    top: 35px;
    left: 10px;
    width: 129px;
    height: 148px;
    border: #cccccc 1px solid;
    overflow-y: auto;
}
.ob-reserve-time-hour-area > div {
    cursor: pointer;
    text-align: center;
    padding: 5px;
}
.ob-reserve-time-hour-area > div:hover {
    background: #eeeeee;
}
.ob-reserve-time-hour-area > .active {
    background: #FEB900;
    color: #ffffff;
}
.ob-reserve-time-hour-area > .active:hover {
    background: #FEB900;
    color: #ffffff;
}
.ob-reserve-time-minute-area {
    position: absolute;
    top: 35px;
    right: 10px;
    width: 129px;
    height: 148px;
    border-top: #cccccc 1px solid;
    border-right: #cccccc 1px solid;
    border-bottom: #cccccc 1px solid;
    overflow-y: auto;
}
.ob-reserve-time-minute-area > div {
    cursor: pointer;
    text-align: center;
    padding: 5px;
}
.ob-reserve-time-minute-area > div:hover {
    background: #eeeeee;
}
.ob-reserve-time-minute-area > .active {
    background: #FEB900;
    color: #ffffff;
}
.ob-reserve-time-minute-area > .active:hover {
    background: #FEB900;
    color: #ffffff;
}

.ob-reserve-time-area-btn {
    position: absolute;
    bottom: 12px !important;
    left: 10px;
    width: 258px;
    border: #cccccc 1px solid;
    background: #ffffff;
    border-radius: 2px;
    font-size: 12px !important;
}
